<template>
  <div>
    <div class="tips">
      <p>
        <i></i>
        二维码邀请队员，队员需要先入职，APP登入账号扫码加入考勤组
      </p>
    </div>
    <el-tabs v-model="activeName" class="my-tabs">
      <el-tab-pane label="主岗" name="major"></el-tab-pane>
      <el-tab-pane label="兼岗" name="partTime"></el-tab-pane>
    </el-tabs>
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
      <el-form-item>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">刷新</el-button>
        <el-button type="primary" icon="el-icon-plus" size="mini" @click="addTeamFn" plain>
          {{ activeName == 'major' ? '调入队员' : '添加兼岗' }}
        </el-button>
        <el-button size="mini" @click="qrcodeVisible=true">二维码邀请入队</el-button>
      </el-form-item>
    </el-form>
    <el-table v-loading="loading" :data="teamlist" size="small">
      <el-table-column label="档案编号" align="center" prop="id" width="90"/>
      <el-table-column label="姓名" align="center" prop="nickName" width="110"/>
      <el-table-column label="联系电话" align="center" prop="phone"/>
      <el-table-column label="岗位" align="center" prop="phone">
        <template slot-scope="scope">
        {{scope.row.projectPost?scope.row.projectPost.name:''}}
        </template>
      </el-table-column>
      <el-table-column label="职务" align="center" prop="pointsId">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.sys_work_post" :value="scope.row.duties"/>
        </template>
      </el-table-column>
      <el-table-column label="调入日期" align="center" prop="day"/>
      <el-table-column label="操作" align="center">
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            @click="handleUpdate(scope.row)"
            v-hasPermi="['system:stagnation_point:edit']"
          >详情
          </el-button>
          <el-button
            size="mini"
            type="text"
            @click="handleEditUpdate(scope.row)"
            v-hasPermi="['system:stagnation_point:edit']"
          >编辑
          </el-button>
          <el-button
            size="mini"
            type="text"
            @click="deletUser(scope.row)"
            v-hasPermi="['system:stagnation_point:edit']"
          >移除
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <newAdd :param="pointData" multiple ref="orgPicker" :selected="selectList" @ok="selected"
            :pointData="pointData" :isMaster="activeName=='major'?1:0"></newAdd>
    <detailUser :visible.sync="detailVisible" :userId="userId" :param="param" @getList="getList"
                :isMaster="activeName=='major'?1:0"></detailUser>
    <qrcode :visible.sync="qrcodeVisible" :pointData="pointData"></qrcode>
  </div>
</template>

<script>
import {listStagnationPointUser, delStagnationPointUser} from "@/api/system/stagnation_point";
import teamAdd from "@/components/zhudian-team/add"
import newAdd from "@/components/zhudian-team/newAdd";
import detailUser from "@/components/zhudian-team/add";
import qrcode from "./qrcode";

export default {
  name: "index",
  dicts: ['sys_work_post'],
  props: ['paramId', 'projectData', 'pointData'], // param 执勤点信息
  components: {teamAdd, newAdd, detailUser, qrcode},
  data() {
    return {
      activeName: 'major',
      teamlist: [],
      // 遮罩层
      loading: true,
      // 选中数组
      layout: 'total, sizes, prev, pager, next',
      // 总条数
      total: 0,
      queryParams: {
        pageNum: 1,
        pageSize: 100,
        pointsId: 0,
        isMaster: 1
      },
      teamUserVisible: false,
      selectList: [],
      detailVisible: false,
      userId: 0,
      param: null,
      qrcodeVisible: false
    }
  },
  watch: {
    activeName() {
      this.getList()
    }
  },
  created() {
    this.queryParams.pointsId = this.paramId
    this.getList()
  },
  methods: {
    addTeamFn() {
      this.$refs.orgPicker.show()
    },
    // 添加完队员
    selected() {
      this.getList()
    },
    /** 查询定位器列表 */
    getList() {
      this.loading = true;
      if (this.activeName == 'partTime') {
        this.queryParams.isMaster = 0
      } else {
        this.queryParams.isMaster = 1
      }
      listStagnationPointUser(this.queryParams).then(response => {
        this.teamlist = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    deletUser(row) {
      this.$modal
        .confirm(`确定将该人员从执勤点移除,是否继续？`)
        .then(function () {
          return delStagnationPointUser(row.id);
        })
        .then(() => {
          this.$modal.msgSuccess("移除成功");
          this.getList()
        })
        .catch(() => {
        });
    },
    submitForm() {
      if (!this.dealerItem) {
        this.$message.error(this.title)
        return
      }
      let that = this
      console.log('dealerItem:', this.dealerItem, that.queryData)
      // type batchBindingUser 批量绑定设备； bindingUser 单独绑定设备
      if (this.type == 'bindingUser') {
        this.$modal
          .confirm(`确定将该设备绑定至【${this.dealerItem.realName}】,是否继续？`)
          .then(function () {
            return delStagnationPointUser({
              deviceIds: [that.queryData.deviceId],
              dealerId: that.dealerItem.adminId
            });
          })
          .then(() => {
            this.$modal.msgSuccess("绑定成功");
            this.$emit('getList')
            this.cancel()
          })
          .catch(() => {
          });
        return
      }
      if (this.type == 'batchBindingUser') {
        this.$modal
          .confirm(`确定为经销商【${this.dealerItem.realName}】批量绑定【${this.queryData.length}】台设备,是否继续？`)
          .then(function () {
            return DevideBindingUser({
              deviceIds: that.queryData,
              dealerId: that.dealerItem.adminId
            });
          })
          .then(res => {
            // this.$modal.msgSuccess("绑定成功");
            // this.messegeFn(res.msg)
            this.$emit('getList')
            this.cancel()
          })
          .catch(() => {
          });
        return
      }
      this.$emit('dealerGet', this.dealerItem)
      this.cancel()
    },
    cancel() {
      this.$emit('update:visible', false)
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.$router.push(`/security/detail/index/${row.userId}`)
    },
    handleEditUpdate(row) {
      this.userId = row.userId
      this.param = JSON.parse(JSON.stringify(row))
      this.detailVisible = true
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.dealerId = ''
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.dealerId = ''
      this.resetForm("queryForm");
      this.handleQuery();
    },
  }
}
</script>

<style scoped>

</style>
